<!DOCTYPE html>
<html lang="en" xmlns:th="http://thyneleaf.org">
<head>
    <meta charset="UTF-8">
</head>
<body>
<div th:replace="/common/header"></div>
<div id="Content">
<div id="BackLink"><a href="/Main/enter">
    Return to Main Menu</a></div>

<div id="Catalog">

    <div id="Cart">

        <h2>Wish List</h2>
        <form action="UpdateCartQuantities?username=${sessionScope.username}" method="post">
            <style type="text/css">

                table {
                    width: 700px;
                    padding: 0;
                    margin: 0;
                }

                caption {
                    padding: 0 0 5px 0;
                    width: 700px;
                    font: italic 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
                    text-align: right;
                }

                th {
                    font: bold 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
                    color: #4f6b72;
                    border-right: 1px solid #bfa986;
                    border-bottom: 1px solid #bfa986;
                    border-top: 1px solid #bfa986;
                    letter-spacing: 2px;
                    text-transform: uppercase;
                    text-align: left;
                    padding: 6px 6px 6px 12px;
                    background: #eee0c5 no-repeat;
                }

                td {
                    border-right: 1px solid #bfa986;
                    border-bottom: 1px solid #bfa986;
                    background: #fff;
                    font-size:16px;
                    padding: 6px 6px 6px 12px;
                    color: #4f6b72;
                }

            </style>
            <table id="tab">
                <tr>
                    <th><b>Item ID</b></th>
                    <th><b>Product ID</b></th>
                    <th><b>Description</b></th>
                    <th><b>List Price</b></th>
                    <th><b>Remove</b></th>
                    <!--<th>&nbsp;</th>-->
                </tr>
                <tr th:if = "${#lists.isEmpty(list)}">
                    <td colspan="8"><b>Your wishlist is empty.</b></td>
                </tr>

                <tr th:each="item:${list}">
                    <td>
                        <a href="/category/ViewItem?Itemid=${item.itemId}"><th:block th:text="${item.itemId}" />
                        </a>
                    </td>
                    <td><th:block th:text="${item.productId}" />
                    </td>
                    <td><th:block th:utext="${item.description}" />
                    </td>
                    <td><th:block th:text="${item.listPrice}" />
                    </td>
                    <td>
                        <a th:href="${'/account/deleteWish?Itemid='}+${item.itemId}" class="Button"> Remove </a>
                    </td>
                </tr>
                <script src="../js/cartChange.js"></script>
                </th:each>
                <tr>
                <tr id="lastTR">
                    <td colspan="7" id="lastTD">
                    </label>
                        <!--<fmt:formatNumber value="${sessionScope.cart.subTotal}" pattern="$#,##0.00" />-->
                    </td>
                   <!-- <td>&nbsp;</td>-->
                </tr>
            </table>&nbsp;
            </tr>
            </table>
        </form>
    </div>


    <div id="Separator">&nbsp;</div>
</div>
</div>
<div th:replace="/common/footer"></div>
</body>
</html>